<script setup lang='ts'>
import { useEcharts } from '@/hooks'

const props = defineProps(['options', 'loading', 'isEmpty'])
const { options, loading, isEmpty } = toRefs(props)
const { domRef: flowRef } = useEcharts(options)
</script>

<template>
  <div relative w-full :class="isEmpty ? 'is-empty' : ''">
    <div v-if="loading" class="absolute left-0 top-0 wh-full flex-center">
      <i-svg-spinners:12-dots-scale-rotate class="wh-8 text-primary" />
    </div>
    <div v-else ref="flowRef" class="wh-full" />
  </div>
</template>

<style scoped lang='scss'>

</style>
